import Taro from "@tarojs/taro";
import {View, Text} from "@tarojs/components";
import "./read-record.less";
import LoadMore from "../../commponents/load-more/load-more";
import Api from "../../api/api";
import dayjs from "dayjs";
import Feed from "../../commponents/feed/feed";
import NavBar from "../../commponents/nav-bar/nav-bar";
import {getGlobal} from "../../api/globalData";

export default class Template extends Taro.Component {
  config = {
    navigationBarTextStyle: "black"
  };

  constructor() {
    super(...arguments);
    this.state = {
      loadingMore: "",
      docList: [],
      pageNo: 1
    };
  }

  async componentDidMount() {
    await this.getList(1);
  }

  async onReachBottom() {
    if (this.state.loadingMore === "noMore") {
      return;
    }
    this.setState({loadingMore: "loading"});
    await this.getList(this.state.pageNo + 1);
  }

  async getList(pageNo) {
    let d = await Api.readRecordsList(pageNo, 20);
    let res = d.data.data;

    let list = res.list;
    let docList = this.state.docList;
    list.forEach(v => {
      v.createdAt = dayjs(v.created_at).format("YYYY-MM-DD HH:mm");
      docList.push(v);
    });

    const loadingMore = res.hasNext ? "" : "noMore";
    this.setState({
      loadingMore: loadingMore,
      docList: docList,
      pageNo: pageNo
    });
  }

  render() {
    return (
      <View>
        <NavBar title='阅读过的文章'/>
        <View className="container">
          <View className="note-list">
            {this.state.docList.map((doc, index) => {
              return <Feed note={doc} key={index}/>;
            })}
          </View>
          <LoadMore loadingMore={this.state.loadingMore}/>
        </View>
      </View>
    );
  }
}
